<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>教程</title>
    <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
    <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
    <!-- Bootstrap -->
    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

    <script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.11/handlebars.min.js"></script>
    <!-- HTML5 shim 和 Respond.js 是为了让 IE8 支持 HTML5 元素和媒体查询（media queries）功能 -->
    <!-- 警告：通过 file:// 协议（就是直接将 html 页面拖拽到浏览器中）访问页面时 Respond.js 不起作用 -->
    <!--[if lt IE 9]>
    <script src="https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="https://cdn.bootcss.com/bootstrap/3.2.0/js/transition.js"></script>
    <script src="https://cdn.bootcss.com/layer/3.1.0/layer.js"></script>
    <script src="https://cdn.bootcss.com/toastr.js/latest/toastr.min.js"></script>
    <script src=js/nebPay.js></script>
    <link rel="shortcut icon" href="assets/logo.png" type="image/x-icon">

    <link href="https://cdn.bootcss.com/toastr.js/latest/toastr.css" rel="stylesheet">
    <link href="./css/how.css" rel="stylesheet">

    <link rel=stylesheet href=./css/main.css>
    <script src="js/main.js"></script>


</head>

<body>

<header class="navbar navbar-static-top bs-docs-nav" id="top">
    <div class="container">
        <div class="navbar-header" >
            <button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target="#bs-navbar" aria-controls="bs-navbar" aria-expanded="false">
                <span class="glyphicon glyphicon-menu-hamburger" id="nav-button"></span>
            </button>
            <img src="./assets/cc535e43e566c88eb96103bdb4e8e42e.png" style="width: 50px;height: 50px;float: left;margin-top:5px;margin-right: 10px;" />
            <a href="../" class="navbar-brand"  style="color:#ffffff;">Hello, WorldCup!</a>
        </div>
        <nav id="bs-navbar" class="navbar-collapse collapse navbar-inverse" aria-expanded="false" style="height: 1px;">
            <ul class="nav navbar-nav my-nav">
                <li>
                    <a href="./how.html" >教程</a>
                </li>
                <li >
                    <a id="self-info" href="javascript:;" onclick="getUserRecord()">个人信息</a>
                </li>
                <li >
                    <a href="javascript:;" onclick="$('#getNasModel').modal('show')" >获取免费 0.1 Nas !</a>
                </li>
                <li >
                    <a id="phoneButton1" href="javascript:;" onclick="deposit()" style="display: none" >兑换Coin</a>
                </li>
                <li >
                    <a id="phoneButton2" href="javascript:;" onclick="withdraw()"  style="display: none">提现Nas</a>
                </li>
            </ul>
            <ul class="nav navbar-nav navbar-right">
                <!-- <li><a href="http://mb.bootcss.com" onclick="_hmt.push(['_trackEvent', 'docv3-navbar', 'click', 'themes'])" target="_blank">主题/模板</a></li> -->
                <li><a href="https://chrome.google.com/webstore/detail/nasextwallet/gehjkhmhclgnkkhpfamakecfgakkfkco" >下载Nas网页插件</a></li>
            </ul>
        </nav>
    </div>
</header>
<div class="bs-docs-header" id="top-content" tabindex="-1">
    <div class="container">
        <h1 ><span id="nav-title" style="color: #ffffff;font-size: 5rem">拒绝伪去中心化</span></h1>
        <p>没有数据库，不存储任何信息，甚至没有后台开发；比赛、预测、派奖、兑换，统统上链；智能合约自动执行。</p>
        <p>区块链是最诚实的数据库和后台系统，让区块链说话！</p>
    </div>
</div>
<div class="container">
    <div class="row" >
        <div class="col-xs-12 col-md-" role="main" style="background-color: #ffffff">
            <h1 id="overview" class="page-header"><a class="anchorjs-link " href="#overview" aria-label="Anchor link for: overview" data-anchorjs-icon="" style="font-family: anchorjs-icons; font-style: normal; font-variant: normal; font-weight: normal; line-height: inherit; position: absolute; margin-left: -1em; padding-right: 0.5em;"></a>关于项目</h1>
            <p >项目的所有信息存储、充值提现、奖金分配逻辑全部由区块链智能合约实现；在服务器中不存储和实现任何用户信息以及业务逻辑</p>
            <p >项目在过程中不会收取任何手续费用或者差价；用户只需要耗费少量的Nas燃料即可完成竞猜；在奖金分配等过程中的燃料耗费由开发者个人贡献</p>
            <h1 class="page-header"><a class="anchorjs-link " href="#overview" aria-label="Anchor link for: overview" data-anchorjs-icon="" style="font-family: anchorjs-icons; font-style: normal; font-variant: normal; font-weight: normal; line-height: inherit; position: absolute; margin-left: -1em; padding-right: 0.5em;"></a>Soccer Coin积分</h1>
            <p class="lead">应用中的Soccer Coin积分与Nas保持1000 ：1的固定兑换比例</p>
            <p >Soccer Coin只是方便投注额的计算以及减少燃料耗费，并不是实际的NRC20代币；你可以随时充值或者提现。</p>

            <h1 class="page-header"><a class="anchorjs-link " href="#overview" aria-label="Anchor link for: overview" data-anchorjs-icon="" style="font-family: anchorjs-icons; font-style: normal; font-variant: normal; font-weight: normal; line-height: inherit; position: absolute; margin-left: -1em; padding-right: 0.5em;"></a>赔率</h1>
            <p class="lead">返奖金额计算公式为：总竞猜金额 *  (正确选项总金额 / 你的投注金额 )</p>
            <p >请注意，页面显示的竞猜选项赔率并不是固定不变的；它只代表当前时刻用户的竞猜比例，你的竞猜也可能会影响这个比例；最终返奖比例以开赛时刻的竞猜情况为准</p>
            <h1 class="page-header"><a class="anchorjs-link " href="#overview" aria-label="Anchor link for: overview" data-anchorjs-icon="" style="font-family: anchorjs-icons; font-style: normal; font-variant: normal; font-weight: normal; line-height: inherit; position: absolute; margin-left: -1em; padding-right: 0.5em;"></a>如何开始</h1>
            <p class="lead">开始竞猜前，需要准备一个星云链钱包。</p>
            <p >使用Chrome,前往Chrome Web Store安装插件<a href="https://chrome.google.com/webstore/detail/nasextwallet/gehjkhmhclgnkkhpfamakecfgakkfkco">星云钱包插件</a></p>
            <p>或是移动端星云链App钱包：<a href="https://nano.nebulas.io/index_cn.html">安卓版、IOS版（在中国大陆以外App Store下载）</a></p>
            <p>往钱包存入一定量的Nas用于竞猜，然后直接点击网站相关竞猜按钮即可</p>
            <p>你当然可以免费体验区块链竞猜的魅力，告诉作者你的钱包地址，作者免费发送一些燃料费用到你的地址，并可以在网站领取免费0.1Nas竞猜金额！</p>
            <p>Email : huangkenc@126.com</p>
        </div>

        </div>
    </div>
</div>
<!--投注弹出框-->
<div class="modal fade" id="betModel" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">确认竞猜选项</h4>
            </div>
            <div class="modal-body">
                <div id = 'betMatchId' style="display: none"></div>
                <h4>竞猜前，请务必查看教程了解规则</h4>
                <p>显示赔率仅供参考，会随着竞猜过程不断变化；比赛前5分钟关闭竞猜；</p>
                <h4>比赛结束后，智能合约自动计算</h4>
                <p>竞猜金额须大于100 Soccer Coin !</p>
                <HR align=center width=100% color= #a2a9b9 SIZE=10>

                <h4 style="text-align: center;margin-top: 20px;"><span id="betHomeName"></span>  vs  <span id="betAwayName"></span></h4>
                <h4 style="text-align: center;margin-top: 20px;"><span id="betChoose"></span></h4>
                <HR align=center width=100% color= #a2a9b9 SIZE=10>

                <div class="form-group">
                    <label for="bet-amount" class="control-label">竞猜金额(Soccer Coin):</label>
                    <input type="text" class="form-control" id="bet-amount" style="width: 90%;text-align: center;margin: 0 auto;">
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" onclick="goBetButton()">确认竞猜</button>
            </div>
        </div>
    </div>
</div>
<!--无插件弹出框-->
<div class="modal fade" id="noWalletModel" tabindex="-1" role="dialog" aria-labelledby="noWallet">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="noWallet">请先安装星云钱包插件</h4>
            </div>
            <div class="modal-body">
                <h4>竞猜需要依赖星云钱包插件</h4>
                <p>不知道如何安装？请点击<a href="">这里</a>查看教程</p>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary" data-dismiss="modal">关闭</button>
                </div>
            </div>
        </div>
    </div>
</div>
<!--兑换弹出框-->

<div class="modal fade" id="depositModel" tabindex="-1" role="dialog" aria-labelledby="deposit">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="deposit">用Nas兑换应用内Soccer Coin</h4>
            </div>
            <div class="modal-body">
                <h4>什么是Soccer Coin?</h4>
                <p>Soccer Coin是本应用内用于竞猜的积分。与Nas保持固定兑换比例1000 : 1;</p>
                <p>你可以随时选择兑换积分或者提现为Nas,所有操作智能合约自动执行</p>
                <div class="form-group">
                    <label for="bet-amount" class="control-label">兑换数量(Nas):</label>
                    <input type="text" class="form-control" id="depositAmount" style="width: 90%;text-align: center;margin: 0 auto;">
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" onclick="depositButton()">确认兑换</button>

                </div>
            </div>
        </div>
    </div>
</div>

<!--提现弹出框-->
<div class="modal fade" id="withdrawModel" tabindex="-1" role="dialog" aria-labelledby="withdraw">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="withdraw">Soccer Coin即时兑换Nas</h4>
            </div>
            <div class="modal-body">
                <h4>兑换限制</h4>
                <p>Soccer Coin最小提现额为100 coin</p>
                <p>免费获取的100 SoccerCoin 需要竞猜一次才能提现</p>
                <p>成功后智能合约自动发送Nas到你的地址</p>

                <div class="form-group">
                    <label for="bet-amount" class="control-label">提现数量(Soccer Coin):</label>
                    <input type="text" class="form-control" id="withdrawAmount" style="width: 90%;text-align: center;margin: 0 auto;">
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" onclick="withdrawButton()">确认提现</button>
                </div>
            </div>
        </div>
    </div>
</div>
<!--交易成功弹出框-->
<div class="modal fade" id="tranSuccessModel" tabindex="-1" role="dialog" aria-labelledby="successInfo">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="successInfo">交易成功</h4>
                <p>具体以交易确认为准，确认后即可刷新状态</p>
            </div>
            <div class="modal-body">
                <h4>区块链交易txHash : </h4>
                <p id="successId"></p>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>

                </div>
            </div>
        </div>
    </div>
</div>
<!--获取免费Nas弹出框-->
<div class="modal fade" id="getNasModel" tabindex="-1" role="dialog" aria-labelledby="successInfo">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="getNas">获取免费100 SoccerCoin（0.1Nas）</h4>
                <!--<p style="margin-top: 2rem">Sorry,开发者能力有限</p>-->
                <!--<p>免费获取活动暂时停止.</p>-->
                <!--<p>后续会择机重新开放</p>-->
                <!--<p>用0.1nas换取积分玩一玩呀 :-D</p>-->
                <p style="margin-top: 2rem">调用合约免费获取</p>
                <p>竞猜后即可提现.</p>
                <p>任何恶意刷量行为都不会得到回报.</p>

                <p>开发者能力有限，活动随时停止 :-D</p>

            </div>
            <div >

                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" data-dismiss="modal" onclick="getNasButton()">发送交易</button>

                </div>
            </div>
        </div>
    </div>
</div>
<!--个人信息弹出框-->
<div class="modal fade" id="user-infoModel" tabindex="-1" role="dialog" aria-labelledby="user-info">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="user-info">个人信息</h4>
            </div>
            <div class="modal-body">
                <p>钱包地址: <span id="user-address"></span></p>
                <p>余额: <span id="user-balance"></span> Soccer Coin</p>
                <HR align=center width=100% color= #a2a9b9 SIZE=10>

                <div class="form-group">
                    <table class="table" id="recordTable">
                        <script type="text/x-handlebars-template" id="recordTemplate">

                            <caption>地址记录.</caption>
                            <thead>
                            <tr>
                                <th>#</th>
                                <th>类型</th>
                                <th>备注</th>
                                <th>金额</th>
                            </tr>
                            </thead>

                            <tbody>

                            {{#if result}}
                            {{#each result}}
                            <tr>
                                <th scope="row">{{index}}</th>
                                <td>{{type}}</td>
                                <td>{{remark}}</td>
                                <td>{{amount}}</td>
                            </tr>
                            {{/each}}
                            {{/if}}
                        </script>

                        </tbody>

                    </table>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                </div>
            </div>
        </div>
    </div>
</div>
<!--email-->
<div class="modal fade" id="emailModel" tabindex="-1" role="dialog" aria-labelledby="email">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">开发者邮箱</h4>
            </div>
            <div class="modal-body">
                <h4>huangkena@126.com</h4>

            </div>

            <div >

                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>

                </div>
            </div>
        </div>
    </div>
</div>
<footer class="bs-docs-footer">
    <div class="container">
        <ul class="bs-docs-footer-links">
            <li><a href="">GitHub 仓库</a></li>
            <li><a href="www.nebulas.io">Nas星云链</a></li>
            <li><a href="">非盈利项目</a></li>
            <li><a href="#" onclick="$('#emailModel').modal('show')">联系开发者</a></li>
        </ul>

    </div>
</footer>
</body>

</html>